<template>
	<view >
		<view class="footer">
			<view @tap="toIndex">
				<image src="/static/svg/hongjujia.svg" v-if="active==0"></image>
				<image src="/static/svg/jujia1.svg" v-if="active!=0"></image>
				<text :class="{footer_active:active==0}">居家</text>
			</view>
			<view @tap="toShop">
				<image src="/static/svg/hongshangcheng.svg" v-if="active==1"></image>
				<image src="/static/svg/shangcheng1.svg" v-if="active!=1"></image>
				<text :class="{footer_active:active==1}">商城</text>
			</view>
			<view >
				<image src="/static/svg/release.svg" class="middle_img" @tap="open"></image>
			</view>
			<view @tap="toShopCart" style="">
				<image src="/static/svg/honggouwuche.svg" v-if="active==2"></image>
				<image src="/static/svg/gouwuche1.svg" v-if="active!=2"></image>
				<text :class="{footer_active:active==2}">购物车</text>
			</view>
			<view @tap="toPersonal">
				<image src="/static/svg/hongwode.svg" v-if="active==3"></image>
				<image src="/static/svg/wode.svg" v-if="active!=3"></image>
				<text :class="{footer_active:active==3}">我的</text>
			</view>
		</view>
		<uni-popup ref="popup" type="bottom">
			<view class="popup_body">
				<view @tap='toIn' v-if="!isDesigner">设计师入驻</view>
				<view @tap="toReleaseDesign" v-else>发布设计作品</view>
				<view @tap="toRelease">发布艺术精品</view>
				<view @tap='toShopTogether'>商家合作</view>
				<view class="cancel" @tap="cancel">取消</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import url from '@/common/util/personal.js'
	import uniPopup from "@/components/uni-popup/uni-popup.vue"
	export default {
		components: {uniPopup},
		data() {
			return {
				isDesigner:false,
				message:""
			}
		},
		created() {
			if(localStorage.getItem('userId')){
				this.toPersonalDeail()
			}
		},
		props:{
			active:{
				type:Number,
				default:0
			}
		},
		methods: {
			async toPersonalDeail(){
				let userId=localStorage.getItem("userId")
				let res=await url.getHome({userId:userId,selfId:userId})
				if(res.code==0){
					this.message=res.data
					if(res.data.userType=='设计师'){
						this.isDesigner=true
					}else{
						this.isDesigner=false
					}
				}
			},
			open() {
				if(!localStorage.getItem('userId')){
					uni.navigateTo({
						url: '/pages/login/login'
					})
					return
				}
				this.$refs.popup.open()	
			},
			cancel(){
				this.$refs.popup.close()
			},
			toRelease(){
				localStorage.removeItem('releaseFineArtMessage')
				this.$refs.popup.close()
				uni.navigateTo({
					url: '/pages/ReleaseFineArt/release'
				})
			},
			toReleaseDesign(){
				localStorage.removeItem('releaseDesignMessage')
				this.$refs.popup.close()
				uni.navigateTo({
					url: '/pages/releaseDesign/releaseDesign'
				})
			},
			toPersonal(){
				if(this.active!=3){
					if(!localStorage.getItem('userId')){
						uni.navigateTo({
							url: '/pages/login/login'
						})
						return
					}
					if(this.isDesigner){
						uni.navigateTo({
							url: '/pages/personal/designer'
						})
					}else{
						uni.navigateTo({
							url: '/pages/personal/plainUser'
						})
					}
				}
			},
			toShopTogether(){
				this.$refs.popup.close()
				uni.navigateTo({
					url: '/pages/personal/storeTogether'
				})
			},	
			toIndex(){
				if(this.active!=0){
					uni.navigateTo({
						url: '/pages/index/index'
					})
				}
			},
			toShop() {
				if(this.active!=1){
					uni.navigateTo({
						url: '/pages/index/shopindex'
					})
				}
			},
			toShopCart() {
				if(!uni.getStorageSync('token')){
					uni.navigateTo({
						url: '/pages/public/login'
					})
					return
				}
				uni.navigateTo({
					url: '/pages/cart/shopCart'
				})
			},
			toIn(){
				this.$refs.popup.close()
				if(this.message.isApply=='N'){
					uni.navigateTo({
						url: '/pages/personal/designerSettledIn'
					})
				}else if(this.message.isSuccess=='N'){
					uni.navigateTo({
						url: '/pages/personal/designerSettledIn?type=isError'
					})
				}else if(this.message.isSuccess=='Z'){
					uni.navigateTo({
						url: '/pages/personal/designerSettledIn?type=isLoading'
					})
				}
			}
		},
	}
</script>

<style lang="scss" scoped>
	.footer{
		height:88rpx ;
		position: fixed;
		width: 750rpx;
		bottom: 0;
		left: 0;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 55rpx;
		background-color: #FFFFFF;
		box-shadow:0px -1px 0px 0px rgba(0,0,0,0.08);
		z-index: 998;
		overflow: hidden;
		view{
			display: flex;
			flex-flow: column;
			align-items: center;
			justify-content: flex-start;
			height: 88rpx;
			width: 44rpx;
			word-break: keep-all;
			image{
				height: 44rpx;
				width: 44rpx;
				display: block;
				margin-top: 12rpx;
				color: #B3392B;
			}
			text{
				font-size: 22rpx;
				color: #999999;
				letter-spacing: 1rpx;
				line-height: 22rpx;
				margin-top: 6rpx;
			}
			.footer_active{
				color: #B3392B;
			}
			.middle_img{
				height: 94rpx;
				width: 94rpx;
				position: relative;
				top: 4rpx;
				margin-top: 0;
			}
		}
	}
	.popup_body{
		position: absolute;
		bottom: 43rpx;
		left:25rpx;
		width: 700rpx;
		background-color: #FFFFFF;
		border-radius: 25rpx;
		height: 436rpx!important;
		view{
			width: 100%!important;
			height: 108rpx;
			border-bottom: 1rpx solid #D8D8D8;
			font-size: 34rpx;
			color: #A66354;
			line-height:107rpx ;
			text-align: center;
		}
		.cancel{
			color: #999999;
		}
	}
	.popup_body>view:last-of-type{
		border: 0;
	}
</style>
